
/*######################################
		CATERGORIES tap
#######################################*/
.tab {
	float: left;
	margin-top: 0px;
    background-color: #f1f1f1;
    width: 100%;
	
}

.tab li a {
	display: block;
	color: #153E52;
	text-decoration: none;
	background-color: inherit;
	padding: 6px ;
	border-bottom: 0.5px solid grey;
	text-align: left;
	cursor: pointer;
	transition: 0.3s;
	font-size: 12px;
	
}

.tab li {
	
	text-decoration: none;
	margin-left:-44px;
	outline: none;
}


.tab li:hover {
	background-color: #052B59;
	color: white;
}
.tab a:hover {
	color: white;
}

.tab a.active {
	  background-color: #052B59;
	  color: white;
}

.tabcontent {
		color: white;
		display: none;	
		float: left;
		padding: 0px;
		border-bottom: 1px solid #ccc;
		width: 85.5%;
		border-right: none;
		
}
.Numbers{
	color: #0073FC;
	font-size: 12.5px;
}
.Text {
	font-size: 12.5px;
}
@media (max-width: 800px) {
	.tab {
		background-color: #f1f1f1;
		width: 100%;	
		
	}
	
	.tab li a {
		color: #153E52;
		padding: 2.8px ;
		font-size: 9.5px;
		
	}
	
	.tab li {
		
		text-decoration: none;
		margin-left:-40px;
		outline: none;
	}
	
	.tabcontent {
	  color: white;
	  display: none;	
	 width: 80%;

	}
	.Numbers{
	color: #0073FC;
	font-size: 0px;
	}
	.Text {
	font-size: 0px;
}
}

/* Style the buttons */
.btnAcc {
  border: none;
  outline: none;
  padding: 12px;
  margin-bottom: 2px;
  
  cursor: pointer;
  width: 24%;
  font-size: 13px;
}
.btnAcc img{
  border: none;
  outline: none;
  width: 100%;
}

.btnAcc:hover {
  background-color: #ddd;
}

.btnAcc.active {
  background-color: #666;
  color: white;
}

@media (max-width: 880px) {
	.btnAcc {
		  padding: 8px;
		  width: 24%;
		  font-size: 10px;
	}
}








/*######################################
		Jane Furse PAGE
######################################*/
.tabJF {
  float: left;
  border: 1px solid #ccc;
  background-color: #f1f1f1;
  width: 15%;
  height: 1200px;
  
}
.tabJF a{
  float: left;
  color: grey;
  font-size-adjust: 13.5px;
  text-decoration: none;
   width: 100%;
}

/* Style the buttons inside the tab */
.tabJF button {
	display: block;
	background-color: inherit;
	color: black;
	padding: 22px 16px;
	width: 100%;
	height: 39px;
	border: none;
	outline: none;
	text-align: left;
	cursor: pointer;
	transition: 0.3s;
	font-size: 14px;
}

/* Change background color of buttons on hover */
.tabJF button:hover {
  background-color: #052B59;
	color: white;
}

/* Create an active/current "tab button" class */
.tabJF button.active {
  background-color: #052B59;
  color: white;
}

/* Style the tab content */
.tabcontentJF {
  float: left;
  padding: 0px 12px;
  border: 1px solid #ccc;
  width: 85%;
  border-left: none;
  height: 100%;
}
/* Style the tab content */
.tabcontentJFAdvertise {
  float: left;
  padding: 0px 12px;
  border: 1px solid #ccc;
  width: 100%;
  border-left: none;
  height: 100%;
}

@media (max-width: 880px) {
	.tabJF {
		width: 20%;
		height: 100%;
	}
	
	.tabJF a{
		float: left;
		color: grey;
		font-size-adjust: 10px;
		text-decoration: none;
		margin-left: -4%;
		width: 110%;
  
	}
	.tabJF button {
		  display: block;
		  background-color: inherit;
		  color: black;
		  padding: 2px 6px;
		  width: 100%;
		   height: 50px;
		   border: 0.5px solid grey;
		  border: none;
		  outline: none;
		  text-align: left;
		  cursor: pointer;
		  transition: 0.3s;
		  font-size: 12px;
	}	
	.tabcontentJF {
		  float: left;
		  padding: 0px 12px;
		  border: 1px solid #ccc;
		  width: 78%;
		  border-left: none;
		  height: 100%;
	}
}	
	
	
	
/*######################################
		Brass Band PAGE
######################################*/
table.AdvertTables {
  border: 1px solid #1C6EA4;
  background-color: #EEEEEE;
  width: 99%;
  text-align: left;
  border-collapse: collapse;
  position: relative;
}
table.AdvertTables img{
	width: 100%;
	}

table.AdvertTables td, table.AdvertTable th {
  border: 1px solid #AAAAAA;
  padding: 3px 2px;
  width: 33%;
  
}
table.AdvertTables a{
	text-decoration:none;
	color: #414241;
}
table.AdvertTables a:hover{
	color: orange;
}

table.AdvertTables tbody td {
  font-size: 13px;
  color: #414241;
}
table.AdvertTables tr:nth-child(even) {
  background: #D0E4F5;
}
table.AdvertTables thead {
  background: #1C6EA4;
  background: -moz-linear-gradient(top, #5592bb 0%, #327cad 66%, #1C6EA4 100%);
  background: -webkit-linear-gradient(top, #5592bb 0%, #327cad 66%, #1C6EA4 100%);
  background: linear-gradient(to bottom, #5592bb 0%, #327cad 66%, #1C6EA4 100%);
  border-bottom: 2px solid #444444;
}
table.AdvertTables thead th {
  font-size: 15px;
  font-weight: bold;
  color: black;
  border-left: 2px solid #D0E4F5;
}
table.AdvertTables thead th:first-child {
  border-left: none;
}

@media screen and (max-width: 880px) {
	table.AdvertTables thead th {
		font-size: 10.5px;
	}
	table.AdvertTables tbody td {
		font-size: 10.5px;
	}
	table.AdvertTables img{
	width: 100%;
	}
	table.AdvertTables {
  width: 100%;
  
}
}




	
	

/*######################################
		BSCHOOLS PAGE
######################################*/
table.AdvertTable {
  border: 1px solid #1C6EA4;
  background-color: #EEEEEE;
  width: 80%;
  text-align: left;
  border-collapse: collapse;
  position: relative;
}

table.AdvertTable img{
	width: 58%;
}

.PiCschool img:hover {
		transform: scale(1.24) translateY(2px); 
		z-index: 1; 
		-webkit-transition: 0.3s;
		transition: 0.5s;
		border: 0px solid grey;
}
table.AdvertTable td, table.AdvertTable th {
  border: 1px solid #AAAAAA;
  padding: 3px 2px;
  width: 33%;
  
}

table.AdvertTable tbody td {
  font-size: 13px;
  color: #414241;
}
table.AdvertTable tr:nth-child(even) {
  background: #D0E4F5;
}
table.AdvertTable thead {
  background: #1C6EA4;
  background: -moz-linear-gradient(top, #5592bb 0%, #327cad 66%, #1C6EA4 100%);
  background: -webkit-linear-gradient(top, #5592bb 0%, #327cad 66%, #1C6EA4 100%);
  background: linear-gradient(to bottom, #5592bb 0%, #327cad 66%, #1C6EA4 100%);
  border-bottom: 2px solid #444444;
}
table.AdvertTable thead th {
  font-size: 15px;
  font-weight: bold;
  color: black;
  border-left: 2px solid #D0E4F5;
}
table.AdvertTable thead th:first-child {
  border-left: none;
}

@media screen and (max-width: 880px) {
	table.AdvertTable thead th {
		font-size: 10.5px;
	}
	table.AdvertTable tbody td {
		font-size: 10.5px;
	}
	table.AdvertTable img{
	width: 100%;
	}
	table.AdvertTable {
  width: 60%;
  
}
}







/*######################################
		emergency table 
#######################################*/

.Emergency {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 70%;
  margin-left:10px;
  font-size: 14;
}

.Emergency td, th {
  border: 1px solid red;
  text-align: left;
  padding: 0.5px;
}

.Emergency tr:nth-child(even) {
  background-color: #dddddd;
}

 .Emergency a {
	color: red;
	text-decoration: none;
}

 .Emergency a:hover {
	color:  orange;
	text-decoration: none;
}
.ten {
  width: 20%
}
.twenty {
  width: 50%;
}

@media (max-width:679px) {
	.Emergency {
		width: 90%;
		font-size: 12.7
	}
	.ten {
		width: 30%
}
	.twenty {
	  width: 60%;
	}
}












/*######################################
		Scrollbar
#######################################*/

#overflowTest {
 
}
@media (max-width: 800px) {
	#overflowTest {
	   background: inherit;
	  color: white;
	  padding: 2px;
	  width:98%;
	  height: 1300px;
	  overflow: scroll;
	}
}